<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html>
<head>
	<title>订单查询</title>
	<meta name="decorator" content="default"/>
	<script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=kOQ8j9rd2ATw2R54boLMFUalu3gGNGDO&s=1"></script>
	<script src="${ctxStatic}/js/jquery.validate.js" type="text/javascript"></script>
	<script type="text/javascript">
		$(document).ready(function() {
			if("${message}".length>0){
				alert("${message}");
			}
			
			/*表单验证*/
			$('#fb').validate({
				rules : {
					lineid : "required",
					boardaddr : "required",
					fromdate: "required",
					enddate: "required",
					allprice: "required",
					minamount: "required",
					maxamount: "required",
					contacts: "required",
					payertel : {
						required : true,
						isMobile : true
					}
				},
				messages : {
					lineid:"<i class='verico'></i>请选择路线",
					boardaddr : "<i class='verico'></i>请输入详细地址",
					fromdate: "<i class='verico'></i>请选择出发时间",
					enddate: "<i class='verico'></i>请选择截止时间",
					allprice: "<i class='verico'></i>请输入总金额",
					minamount: "<i class='verico'></i>请输入成团人数",
					maxamount: "<i class='verico'></i>请输入最大参与人数",
					contacts: "<i class='verico'></i>请输入联系人",
					payertel : {
						required : "<i class='verico'></i>请输入手机号码",
						isMobile : "<i class='verico'></i>请输入正确手机号码"
					}
				}

			});
			/*手机验证*/
			jQuery.validator
					.addMethod(
							"isMobile",
							function(value, element) {
								var length = value.length;
								var mobile = /^(13[0-9]{9})|(18[0-9]{9})|(14[0-9]{9})|(17[0-9]{9})|(15[0-9]{9})$/;
								return this.optional(element)
										|| (length == 11 && mobile
												.test(value));
							}, "请正确填写您的手机号码");
			
			
			
		});
		function page(n,s){
			$("#pageNo").val(n);
			$("#pageSize").val(s);
			$("#searchForm").submit();
        	return false;
        }
	</script>
	<script type="text/javascript">
//百度地图API功能
function G(id) {
	return document.getElementById(id);
}
var map = new BMap.Map("l-map");
var ac = new BMap.Autocomplete(    //建立一个自动完成的对象
	{"input" : "suggestId"
	,"location" : map
});
ac.addEventListener("onhighlight", function(e) {  //鼠标放在下拉列表上的事件
var str = "";
	var _value = e.fromitem.value;
	var value = "";
	if (e.fromitem.index > -1) {
		value = _value.province +  _value.city +  _value.district +  _value.street +  _value.business;
	}    
	str = "FromItem<br />index = " + e.fromitem.index + "<br />value = " + value;
	value = "";
	if (e.toitem.index > -1) {
		_value = e.toitem.value;
		value = _value.province +  _value.city +  _value.district +  _value.street +  _value.business;
	}    
	str += "<br />ToItem<br />index = " + e.toitem.index + "<br />value = " + value;
	G("searchResultPanel").innerHTML = str;
});
var myValue;
ac.addEventListener("onconfirm", function(e) {    //鼠标点击下拉列表后的事件
var _value = e.item.value;
	myValue = _value.province +  _value.city +  _value.district +  _value.street +  _value.business;
	G("searchResultPanel").innerHTML ="onconfirm<br />index = " + e.item.index + "<br />myValue = " + myValue;
	setPlace();
	// 选中详细地址后，调用百度地图获取 云地理编码 
	var address = encodeURIComponent(myValue);
	$.getJSON(
			"https://api.map.baidu.com/cloudgc/v1?ak=kOQ8j9rd2ATw2R54boLMFUalu3gGNGDO&s=1&address="+address+"&callback=?",
			function(data){
			if(data.status == 0 && data.result.length>0 ){
				$('#departcityName').val(data.result[0].address_components.city);
				var $sitename = $('#departcityName').val();
				$.post("${ctxFront}/sms/getSiteId","sitename="+$sitename,function(d){
					if(d!=null&&d!=''){
						$("#siteid").val(d);
					}else{
						$("#siteid").val("");
					}
				});
			}
		});
});
function setPlace(){
	map.clearOverlays();    //清除地图上所有覆盖物
	function myFun(){
		var pp = local.getResults().getPoi(0).point;    //获取第一个智能搜索的结果
		map.centerAndZoom(pp, 18);
		map.addOverlay(new BMap.Marker(pp));    //添加标注
	}
	var local = new BMap.LocalSearch(map, { //智能搜索
	  onSearchComplete: myFun
	});
	local.search(myValue);
}
</script>
</head>
<body>
<ul class="nav nav-tabs">
		<li ><a href="${ctx}/orders/shareProduct/allShareList">有效拼车</a></li>
		<li ><a href="${ctx}/orders/shareProduct/expireShareList">未成功拼车</a></li>
		<li class="active"><a href="javascript:void(0)">添加</a></li>
	</ul>
	<div class="form-horizontal">
	<div class="control-group">
	<label class="control-label">选择发布类型：</label>
		<div class="controls">
			<form  action="${ctx}/orders/shareProduct/addShareProduct" style="display:inline;">
				<input type="hidden" name="type" value="1"/>
				<input type="submit"  value="切换至接送机拼车发布" id="btnSubmit" class="btn btn-primary"/>
			</form>
			<form  action="${ctx}/orders/shareProduct/addShareProduct" style="display:inline;">
				<input type="hidden" name="type" value="2"/>
				<input type="submit"  value="切换至城际拼车发布" id="btnSubmit" class="btn btn-primary"/>
			</form>
		</div>
	</div>
	</div>
	<form action="${ctx}/orders/shareProduct/lvCar" class="form-horizontal" method="post" id="fb">
	<div class="control-group">
	<label class="control-label">选择线路：</label>
	<div class="controls">
			<select id="line" name="lineid" class="input-large span4 required">
				<option value="">请选择</option>
				<c:forEach items="${lineList }" var="line">
					<option value="${line.lineid }">${line.linename }</option>
				</c:forEach>
			</select>
			</div>
	</div>
		<div class="control-group">
			<label class="control-label">上车地点：</label>
			<div class="controls">
				<input type="text"  name="boardaddr"  class="span4 required" id="suggestId" placeholder="请填写详细地址"/>
				<div id="searchResultPanel" style="border:1px solid #C0C0C0;width:150px;height:auto; display:none;"></div>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label">出发时间：</label>
			<div class="controls">
				<input type="text" placeholder="选择日期" class="Wdate span4 required" name="fromdate" 
	  	   	  onclick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm',isShowClear:false});" id="coutm-time" readonly="readonly"/>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label">截止时间：</label>
			<div class="controls">
				<input type="text" placeholder="选择日期" class="Wdate required span4 " name="enddate" 
	  	   	  onclick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm',isShowClear:false});" id="coutm-time" readonly="readonly"/>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label">车型：</label>
			<div class="controls">
				<select name="cargotypeid"  class="span4 required">
			<c:forEach items="${cargotypeList }" var="cargotype">
				<option value="${cargotype.cargotypeid }" >${cargotype.typename }</option>
			</c:forEach>
			</select>
			</div>	
		</div>
		<div class="control-group">
			<label class="control-label">总金额：</label>
			<div class="controls">
				<input type="number" min="0"  name="allprice"  class="span4 required" />
			</div>
		</div> 
		<div class="control-group">
			<label class="control-label">成团人数：</label>
			<div class="controls">
				<input type="number" min="0" name="minamount"  class="span4 required" />
			</div>
		</div>
		<div class="control-group">
			<label class="control-label">最大参与人数：</label>
			<div class="controls">
				<input type="number" min="0" name="maxamount"  class="span4 required" />
			</div>
		</div>
		<div class="control-group">
			<label class="control-label">联系人：</label>
			<div class="controls">
				<input type="text"   name="contacts"  class="span4 required" />
			</div>
		</div>
		<div class="control-group">
			<label class="control-label">联系电话：</label>
			<div class="controls">
				<input type="text"  name="payertel"  class="span4 required">
			</div>
		</div>
		<div class="form-actions">
				<input id="btnSubmit" class="btn btn-primary" type="submit"
					value="发 布" />&nbsp;
			<input id="btnCancel" class="btn" type="button" value="返 回"
				onclick="history.go(-1)" />
		</div>
	</form>
</body>
</html>